import marimo

__generated_with = "0.17.7"
app = marimo.App()


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## flowchart

    > [docs](https://mermaid.js.org/syntax/flowchart.html)

    ```mermaid
    # magic command not supported in marimo; please file an issue to add support
    # %{init: {"flowchart": {"htmlLabels": false}} }%%
    flowchart LR
        markdown["`This **is** _Markdown_`"]
        newLines["`Line1
        Line 2
        Line 3`"]
        markdown --> newLines
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## sequence

    > [docs](https://mermaid.js.org/syntax/sequenceDiagram.html)

    ```mermaid
    sequenceDiagram
        Alice->John: Hello John, how are you?
        Note over Alice,John: A typical interaction<br/>But now in two lines
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## class

    > [docs](https://mermaid.js.org/syntax/classDiagram.html)

    ```mermaid
    ---
    title: Animal example
    ---
    classDiagram
        note "From Duck till Zebra"
        Animal <|-- Duck
        note for Duck "can fly\ncan swim\ncan dive\ncan help in debugging"
        Animal <|-- Fish
        Animal <|-- Zebra
        Animal : +int age
        Animal : +String gender
        Animal: +isMammal()
        Animal: +mate()
        class Duck{
            +String beakColor
            +swim()
            +quack()
        }
        class Fish{
            -int sizeInFeet
            -canEat()
        }
        class Zebra{
            +bool is_wild
            +run()
        }
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## state

    > [docs](https://mermaid.js.org/syntax/stateDiagram.html)

    ```mermaid
     stateDiagram-v2
            State1: The state with a note
            note right of State1
                Important information! You can write
                notes.
            end note
            State1 --> State2
            note left of State2 : This is the note to the left.
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## er

    > [docs](https://mermaid.js.org/syntax/entityRelationshipDiagram.html)

    ```mermaid
    erDiagram
        CAR ||--o{ NAMED-DRIVER : allows
        CAR {
            string registrationNumber PK
            string make
            string model
            string[] parts
        }
        PERSON ||--o{ NAMED-DRIVER : is
        PERSON {
            string driversLicense PK "The license #"
            string(99) firstName "Only 99 characters are allowed"
            string lastName
            string phone UK
            int age
        }
        NAMED-DRIVER {
            string carRegistrationNumber PK, FK
            string driverLicence PK, FK
        }
        MANUFACTURER only one to zero or more CAR : makes
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## journey

    > [docs](https://mermaid.js.org/syntax/userJourney.html)

    ```mermaid
    journey
        title My working day
        section Go to work
          Make tea: 5: Me
          Go upstairs: 3: Me
          Do work: 1: Me, Cat
        section Go home
          Go downstairs: 5: Me
          Sit down: 5: Me
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## gantt

    > [docs](https://mermaid.js.org/syntax/gantt.html)

    ```mermaid
    gantt
        dateFormat  YYYY-MM-DD
        title       Adding GANTT diagram functionality to mermaid
        excludes    weekends
        %% (`excludes` accepts specific dates in YYYY-MM-DD format, days of the week ("sunday") or "weekends", but not the word "weekdays".)

        section A section
        Completed task            :done,    des1, 2014-01-06,2014-01-08
        Active task               :active,  des2, 2014-01-09, 3d
        Future task               :         des3, after des2, 5d
        Future task2              :         des4, after des3, 5d

        section Critical tasks
        Completed task in the critical line :crit, done, 2014-01-06,24h
        Implement parser and jison          :crit, done, after des1, 2d
        Create tests for parser             :crit, active, 3d
        Future task in critical line        :crit, 5d
        Create tests for renderer           :2d
        Add to mermaid                      :1d
        Functionality added                 :milestone, 2014-01-25, 0d

        section Documentation
        Describe gantt syntax               :active, a1, after des1, 3d
        Add gantt diagram to demo page      :after a1  , 20h
        Add another diagram to demo page    :doc1, after a1  , 48h

        section Last section
        Describe gantt syntax               :after doc1, 3d
        Add gantt diagram to demo page      :20h
        Add another diagram to demo page    :48h
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## pie

    > [docs](https://mermaid.js.org/syntax/pie.html)

    ```mermaid
    # magic command not supported in marimo; please file an issue to add support
    # %{init: {"pie": {"textPosition": 0.5}, "themeVariables": {"pieOuterStrokeWidth": "5px"}} }%%
    pie showData
        title Key elements in Product X
        "Calcium" : 42.96
        "Potassium" : 50.05
        "Magnesium" : 10.01
        "Iron" :  5
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## quadrant

    > [docs](https://mermaid.js.org/syntax/quadrantChart.html)

    ```mermaid
    # magic command not supported in marimo; please file an issue to add support
    # %{init: {"quadrantChart": {"chartWidth": 400, "chartHeight": 400}, "themeVariables": {"quadrant1TextFill": "#ff0000"} }}%%
    quadrantChart
      x-axis Urgent --> Not Urgent
      y-axis Not Important --> "Important ❤"
      quadrant-1 Plan
      quadrant-2 Do
      quadrant-3 Delegate
      quadrant-4 Delete
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## requirement

    > [docs](https://mermaid.js.org/syntax/requirementDiagram.html)
    >
    > note: some long text also overflows the box upstream

    ```mermaid
    requirementDiagram
        requirement test_req {
        id: 1
        text: the test text.
        risk: high
        verifymethod: test
        }

        functionalRequirement test_req2 {
        id: 1.1
        text: the second test text.
        risk: low
        verifymethod: inspection
        }

        performanceRequirement test_req3 {
        id: 1.2
        text: the third test text.
        risk: medium
        verifymethod: demonstration
        }

        interfaceRequirement test_req4 {
        id: 1.2.1
        text: the fourth test text.
        risk: medium
        verifymethod: analysis
        }

        physicalRequirement test_req5 {
        id: 1.2.2
        text: the fifth test text.
        risk: medium
        verifymethod: analysis
        }

        designConstraint test_req6 {
        id: 1.2.3
        text: the sixth test text.
        risk: medium
        verifymethod: analysis
        }

        element test_entity {
        type: simulation
        }

        element test_entity2 {
        type: word doc
        docRef: reqs/test_entity
        }

        element test_entity3 {
        type: "test suite"
        docRef: github.com/all_the_tests
        }


        test_entity - satisfies -> test_req2
        test_req - traces -> test_req2
        test_req - contains -> test_req3
        test_req3 - contains -> test_req4
        test_req4 - derives -> test_req5
        test_req5 - refines -> test_req6
        test_entity3 - verifies -> test_req5
        test_req <- copies - test_entity2
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## c4

    > [docs](https://mermaid.js.org/syntax/c4.html)

    ```mermaid
     C4Context
          title System Context diagram for Internet Banking System
          Enterprise_Boundary(b0, "BankBoundary0") {
            Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
            Person(customerB, "Banking Customer B")
            Person_Ext(customerC, "Banking Customer C", "desc")

            Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")

            System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")

            Enterprise_Boundary(b1, "BankBoundary") {

              SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")

              System_Boundary(b2, "BankBoundary2") {
                System(SystemA, "Banking System A")
                System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts. next line.")
              }

              System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
              SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")

              Boundary(b3, "BankBoundary3", "boundary") {
                SystemQueue(SystemF, "Banking System F Queue", "A system of the bank.")
                SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
              }
            }
          }

          BiRel(customerA, SystemAA, "Uses")
          BiRel(SystemAA, SystemE, "Uses")
          Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
          Rel(SystemC, customerA, "Sends e-mails to")

          UpdateElementStyle(customerA, $fontColor="red", $bgColor="grey", $borderColor="red")
          UpdateRelStyle(customerA, SystemAA, $textColor="blue", $lineColor="blue", $offsetX="5")
          UpdateRelStyle(SystemAA, SystemE, $textColor="blue", $lineColor="blue", $offsetY="-10")
          UpdateRelStyle(SystemAA, SystemC, $textColor="blue", $lineColor="blue", $offsetY="-40", $offsetX="-50")
          UpdateRelStyle(SystemC, customerA, $textColor="red", $lineColor="red", $offsetX="-50", $offsetY="20")

          UpdateLayoutConfig($c4ShapeInRow="3", $c4BoundaryInRow="1")

    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## mindmap

    > [docs](https://mermaid.js.org/syntax/mindmap.html)
    >
    > note: icons will not be available

    ```mermaid
    mindmap
      root((mindmap))
        Origins
          Long history
          ::icon(fa fa-book)
          Popularisation
            British popular psychology author Tony Buzan
        Research
          On effectiveness<br/>and features
          On Automatic creation
            Uses
                Creative techniques
                Strategic planning
                Argument mapping
        Tools
          Pen and paper
          Mermaid
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## timeline

    > [docs](https://mermaid.js.org/syntax/timeline.html)

    ```mermaid
    timeline
            title England's History Timeline
            section Stone Age
              7600 BC : Britain's oldest known house was built in Orkney, Scotland
              6000 BC : Sea levels rise and Britain becomes an island.<br> The people who live here are hunter-gatherers.
            section Bronze Age
              2300 BC : People arrive from Europe and settle in Britain. <br>They bring farming and metalworking.
                      : New styles of pottery and ways of burying the dead appear.
              2200 BC : The last major building works are completed at Stonehenge.<br> People now bury their dead in stone circles.
                      : The first metal objects are made in Britain.Some other nice things happen. it is a good time to be alive.

    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## sankey

    > [docs](https://mermaid.js.org/syntax/sankey.html)

    ```mermaid
    ---
    config:
      sankey:
        showValues: false
    ---
    sankey

    Agricultural 'waste',Bio-conversion,124.729
    Bio-conversion,Liquid,0.597
    Bio-conversion,Losses,26.862
    Bio-conversion,Solid,280.322
    Bio-conversion,Gas,81.144
    Biofuel imports,Liquid,35
    Biomass imports,Solid,35
    Coal imports,Coal,11.606
    Coal reserves,Coal,63.965
    Coal,Solid,75.571
    District heating,Industry,10.639
    District heating,Heating and cooling - commercial,22.505
    District heating,Heating and cooling - homes,46.184
    Electricity grid,Over generation / exports,104.453
    Electricity grid,Heating and cooling - homes,113.726
    Electricity grid,H2 conversion,27.14
    Electricity grid,Industry,342.165
    Electricity grid,Road transport,37.797
    Electricity grid,Agriculture,4.412
    Electricity grid,Heating and cooling - commercial,40.858
    Electricity grid,Losses,56.691
    Electricity grid,Rail transport,7.863
    Electricity grid,Lighting & appliances - commercial,90.008
    Electricity grid,Lighting & appliances - homes,93.494
    Gas imports,Ngas,40.719
    Gas reserves,Ngas,82.233
    Gas,Heating and cooling - commercial,0.129
    Gas,Losses,1.401
    Gas,Thermal generation,151.891
    Gas,Agriculture,2.096
    Gas,Industry,48.58
    Geothermal,Electricity grid,7.013
    H2 conversion,H2,20.897
    H2 conversion,Losses,6.242
    H2,Road transport,20.897
    Hydro,Electricity grid,6.995
    Liquid,Industry,121.066
    Liquid,International shipping,128.69
    Liquid,Road transport,135.835
    Liquid,Domestic aviation,14.458
    Liquid,International aviation,206.267
    Liquid,Agriculture,3.64
    Liquid,National navigation,33.218
    Liquid,Rail transport,4.413
    Marine algae,Bio-conversion,4.375
    Ngas,Gas,122.952
    Nuclear,Thermal generation,839.978
    Oil imports,Oil,504.287
    Oil reserves,Oil,107.703
    Oil,Liquid,611.99
    Other waste,Solid,56.587
    Other waste,Bio-conversion,77.81
    Pumped heat,Heating and cooling - homes,193.026
    Pumped heat,Heating and cooling - commercial,70.672
    Solar PV,Electricity grid,59.901
    Solar Thermal,Heating and cooling - homes,19.263
    Solar,Solar Thermal,19.263
    Solar,Solar PV,59.901
    Solid,Agriculture,0.882
    Solid,Thermal generation,400.12
    Solid,Industry,46.477
    Thermal generation,Electricity grid,525.531
    Thermal generation,Losses,787.129
    Thermal generation,District heating,79.329
    Tidal,Electricity grid,9.452
    UK land based bioenergy,Bio-conversion,182.01
    Wave,Electricity grid,19.013
    Wind,Electricity grid,289.366
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## xy

    > [docs](https://mermaid.js.org/syntax/xyChart.html)

    ```mermaid
    xychart
        title "Sales Revenue"
        x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
        y-axis "Revenue (in $)" 4000 --> 11000
        bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
        line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## block

    > [docs](https://mermaid.js.org/syntax/block.html)

    ```mermaid
    block
    columns 1
      db(("DB"))
      blockArrowId6<["&nbsp;&nbsp;&nbsp;"]>(down)
      block:ID
        A
        B["A wide one in the middle"]
        C
      end
      space
      D
      ID --> D
      C --> D
      style B fill:#969,stroke:#333,stroke-width:4px
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## kanban

    > [docs](https://mermaid.js.org/syntax/kanban.html)

    ```mermaid
    ---
    config:
      kanban:
        ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
    ---
    kanban
      Todo
        [Create Documentation]
        docs[Create Blog about the new diagram]
      [In progress]
        id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
      id9[Ready for deploy]
        id8[Design grammar]@{ assigned: 'knsv' }
      id10[Ready for test]
        id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
        id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
      id11[Done]
        id5[define getData]
        id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
        id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }

      id12[Can't reproduce]
        id3[Weird flickering in Firefox]
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## flowchart-elk

    > [docs](https://mermaid.js.org/syntax/flowchart.html#renderer)

    ```mermaid
    # magic command not supported in marimo; please file an issue to add support
    # %{
    init: {"flowchart":
    {"defaultRenderer":
    "elk"}}
    }%%
    flowchart LR
        a --> b --> c --> d --> e --> f --> g --> h --> i --> j --> k --> l --> m --> n --> o --> p --> q --> r --> s --> t --> u --> v --> w --> x --> y --> z
        subgraph Vowels
            a
            e
            i
            o
            u
            y
        end
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## architecture

    > [docs](https://mermaid.js.org/syntax/architecture.html)

    ```mermaid
    architecture-beta
        group api(cloud)[API]

        service db(database)[Database] in api
        service disk1(disk)[Storage] in api
        service disk2(disk)[Storage] in api
        service server(server)[Server] in api

        db:L -- R:server
        disk1:T -- B:server
        disk2:T -- B:db
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## packet

    > [docs](https://mermaid.js.org/syntax/packet.html)

    ```mermaid
    ---
    title: "TCP Packet"
    ---
    packet
    0-15: "Source Port"
    16-31: "Destination Port"
    32-63: "Sequence Number"
    64-95: "Acknowledgment Number"
    96-99: "Data Offset"
    100-105: "Reserved"
    106: "URG"
    107: "ACK"
    108: "PSH"
    109: "RST"
    110: "SYN"
    111: "FIN"
    112-127: "Window"
    128-143: "Checksum"
    144-159: "Urgent Pointer"
    160-191: "(Options and Padding)"
    192-255: "Data (variable length)"
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## radar

    > [docs](https://mermaid.js.org/syntax/radar.html)

    ```mermaid
    ---
    title: "Grades"
    ---
    radar-beta
      axis m["Math"], s["Science"], e["English"]
      axis h["History"], g["Geography"], a["Art"]
      curve a["Alice"]{85, 90, 80, 70, 75, 90}
      curve b["Bob"]{70, 75, 85, 80, 90, 85}

      max 100
      min 0
    ```
    """)
    return


@app.cell(hide_code=True)
def _(mo):
    mo.md(r"""
    ## treemap

    > [docs](https://mermaid.js.org/syntax/treemap.html)

    ```mermaid
    treemap-beta
    "Section 1"
        "Leaf 1.1": 12
        "Section 1.2"
          "Leaf 1.2.1": 12
    "Section 2"
        "Leaf 2.1": 20
        "Leaf 2.2": 25
    ```
    """)
    return


@app.cell
def _():
    import marimo as mo
    return (mo,)


if __name__ == "__main__":
    app.run()

